﻿﻿﻿@extends('admin.Default')
@section('type')
    <link href="{{ asset('myadmin/css/plugins/treeview/bootstrap-treeview.css') }}" rel="stylesheet">
    <link href="{{ asset('myadmin/css/plugins/dropzone/basic.css') }}" rel="stylesheet">
    <link href="{{ asset('myadmin/css/plugins/dropzone/dropzone.css') }}" rel="stylesheet">
    <link href="{{ asset('myadmin/css/plugins/dataTables/dataTables.bootstrap.css') }}" rel="stylesheet">
@stop
@section('content')
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-lg-12">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5><a href="/store/product/create">添加商品</a></h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="dropdown-toggle" data-toggle="dropdown" href="table_data_tables.html#">
                                <i class="fa fa-wrench"></i>
                            </a>
                            <ul class="dropdown-menu dropdown-user">
                                <li><a href="table_data_tables.html#">选项1</a>
                                </li>
                                <li><a href="table_data_tables.html#">选项2</a>
                                </li>
                            </ul>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content">

                        <table class="table table-striped table-bordered table-hover dataTables-example" id="tbody">
                            <thead>
                            <tr>
                                <th>序号</th>
                                <th style="display: none">></th>
                                <th>名称</th>
                                <th>图片</th>
                                <th>处方药</th>
                                <th>价格</th>
                                <th>库存</th>
                                <th>分类</th>
                                <th>标签</th>
                                <th>品牌</th>
                                <th>详情</th>
                                <th>状态</th>
                                <th>上下架</th>
                                <th>改变</th>


                            </tr>
                            </thead>
                            <tbody>
                            @foreach($list as $k=>$v)
                                <tr class="gradeX" id="{{ $k+1 }}">
                                    <td>{{ $k+1 }}</td>
                                    <td style="display: none">{{ $v['id'] }}</td>
                                    <td>{{ $v['name'] }}</td>
                                    <td>
                                        <img src="{{ url('/upload/product/'.$v['preview']) }}" width="60">
                                        <a data-toggle="modal" class="" href="#modal-form" onclick="lookImg(this)">查看所有图片</a>
                                    </td>
                                    <td>{{ $v['nature']==1?'是':'非' }}</td>
                                    <td>{{ $v['price'] }}</td>
                                    <td>{{ $v['stock'] }}</td>
                                    <td>
                                        <div id="{{ 'treeview'.$k }}" class="test"></div>
                                    </td>
                                    <td>
                                        {{ $v['type'] }}
                                    </td>

                                    <td>{{ $v['brand'] }}</td>
                                    <td><a data-toggle="modal" class="btn btn-primary" href="#modal-form-detail" onclick="detail(this)">其他</a></td>
                                    <td class="center">
                                        @if($v['hod']==1)
                                        <a  class="btn btn-danger" onclick="hodType(this)">热推</a>
                                        @else
                                        <a  class="btn btn-primary" onclick="hodType(this)">普通</a>
                                        @endif
                                    </td>
                                    <td class="center">
                                        @if($v['status']==1)
                                        <a  class="btn btn-primary" onclick="delType(this)">正常</a>
                                        @else
                                        <a  class="btn btn-default" onclick="delType(this)">下架</a>
                                        @endif
                                    </td>
                                    <td>
                                        <a data-toggle="modal" class="btn btn-primary"  href="{{ asset("store/product/{$v['id']}/edit") }}">修改</a></td>


                                </tr>
                            @endforeach

                            </tbody>

                        </table>
                        <div id='treeview11' class="test"></div>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <div id="modal-form" class="modal inmodal fade" aria-hidden="true">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="row">
                        <div class="col-sm-12 ">
                            <button class="close"
                                    data-dismiss="modal">&times;
                            </button>

                            <div class="form-group" >
                                <div class="ibox float-e-margins">
                                    <div class="ibox-content ">
                                        <div class="carousel slide" id="carousel2" width="40" height="40">
                                            <ol class="carousel-indicators" id="img_ol">

                                            </ol>
                                            <div class="carousel-inner" id="img_table">

                                            </div>
                                            <a data-slide="prev" href="carousel.html#carousel2" class="left carousel-control">
                                                <span class="icon-prev"></span>
                                            </a>

                                            <a data-slide="next" href="carousel.html#carousel2" class="right carousel-control">
                                                <span class="icon-next"></span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div>

                                <button class="btn btn-sm btn-primary pull-right m-t-n-xs" type="submit"
                                        onclick="delImg(this)" ><strong>删除</strong>
                                </button>
                                <button class="btn btn-sm btn-primary pull-right m-t-n-xs" type="submit"
                                        onclick="preImg(this)" ><strong>设为预览图</strong>
                                </button>
                                <a data-toggle="modal" id="addimg" href="#modal-form-img" onclick="addImg(this)">添加</a>

                            </div>

                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="modal-form-detail" class="modal fade" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="row">
                        <div class="col-sm-12 ">
                            <button class="close"
                                    data-dismiss="modal">&times;
                            </button>
                                <div class="form-group row">
                                    <label class="col-sm-2 control-label">药品名：</label>
                                    <div class="col-sm-6 ">
                                        <input type="text" name="name" class="form-control" value="">
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label class="col-sm-2 control-label">规格：</label>
                                    <div class="col-sm-6">
                                        <input type="text" name="specifications" class="form-control" value="">
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="ibox float-e-margins border-bottom">
                                            <div class="ibox-title">
                                                <h5>药品功能简介</h5>
                                                <div class="ibox-tools">
                                                    <a class="collapse-link">
                                                        <i class="fa fa-chevron-down"></i>
                                                    </a>
                                                    <a class="dropdown-toggle" data-toggle="dropdown" href="form_editors.html#">
                                                        <i class="fa fa-wrench"></i>
                                                    </a>
                                                    <ul class="dropdown-menu dropdown-user">

                                                    </ul>
                                                    <a class="close-link">
                                                        <i class="fa fa-times"></i>
                                                    </a>
                                                </div>
                                            </div>
                                            <div class="ibox-content no-padding" style="display: none;">


                                                <div class="note-editor form-group">


                            <textarea class="note-editor form-control" name="summary" rows="3" >
                            </textarea>

                                                </div>

                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="ibox float-e-margins border-bottom">
                                            <div class="ibox-title">
                                                <h5>药品说明书</h5>
                                                <div class="ibox-tools">
                                                    <a class="collapse-link">
                                                        <i class="fa fa-chevron-down"></i>
                                                    </a>
                                                    <a class="dropdown-toggle" data-toggle="dropdown" href="form_editors.html#">
                                                        <i class="fa fa-wrench"></i>
                                                    </a>
                                                    <a class="close-link">
                                                        <i class="fa fa-times"></i>
                                                    </a>
                                                </div>
                                            </div>
                                            <div class="ibox-content no-padding" style="display: none;">


                                                <div class="note-editor form-group">


                            <textarea class="note-editor form-control" name="instructions" rows="3" >

                            </textarea>

                                                </div>

                                            </div>
                                        </div>
                                    </div>
                                </div>



                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <div id="modal-form-img" class="modal fade" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="row">
                        <div class="col-sm-12 ">
                            <button class="close"
                                     id="delmodal">&times;
                            </button>

                            <div class="form-group" >
                                <div class="ibox float-e-margins">
                                    <div class="ibox float-e-margins">
                                        <div class="ibox-title">
                                            <h5>文件上传</h5>

                                        </div>
                                        <div class="ibox-content">
                                            <form id="my-awesome-dropzone" class="dropzone" action="/store/product/addimg" method="post">
                                                <div class="dropzone-previews"></div>
                                                <input type='hidden' name='_token' value='{{ csrf_token() }}'>
                                                <input type='hidden' name='id' id="pro_img">
                                                <button type="submit" class="btn btn-primary pull-right">提交</button>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>

@stop
@section('script')

    <script src="{{ asset('myadmin/js/plugins/dropzone/dropzone.js') }}"></script>
    <!-- Bootstrap-Treeview plugin javascript -->
    <script src="{{ asset('myadmin/js/plugins/treeview/bootstrap-treeview.js') }}"></script>

    <script>
            @foreach($list as $k=>$v)
               $('{{ '#treeview'.$k }}').treeview({
                levels: 1,
                {!! 'data:'.$v['category'] !!}
            });
            @endforeach

    </script>
    <script>

        function detail(obj) {


            //alert("点击了确认按钮");
            var id = $(obj).parent().parent().children('td').eq(1).html();

            //alert(id);
            $.ajax({
                url: '{{url("store/product/detail")}}',
                type: 'POST',
                dataType: 'json',
                cache: false,
                data: {_token: "{{ csrf_token() }}", id: id},
                success: function (data) {
                    //console.log(data);
                    $("input[name='name']").val(data.name);
                    $("input[name='specifications']").val(data.specifications);
                    $("textarea[name='summary']").html(data.summary);
                    $("textarea[name='instructions']").html(data.instructions);



                },
                error: function (data) {
                    //alert(2222);
                },
            });
        }

        var mid =null;
        function lookImg(obj) {

            var  img='';
            var li = '';

             mid = $(obj).parentsUntil('#tbody').children('td').eq(1).html();
            imgaa = $(obj).parent().parent().find('img');
            console.log(img);
                        //alert("点击了确认按钮");
                        //var id = $(obj).parentsUntil('#tbody').children('td').eq(1).html();

                        //alert(id);
                        $.ajax({
                            url: '{{url("store/product/img")}}',
                            type: 'POST',
                            dataType: 'json',
                            cache: false,
                            data: {_token: "{{ csrf_token() }}", mid: mid},
                            success: function (data) {

                                var num = data.length>6?6:data.length;
                                if(num==0){
                                    $('.icon-prev').css('display','none');
                                    $('.icon-next').css('display','none');
                                }else{
                                    $('.icon-prev').css('display','inline');
                                    $('.icon-next').css('display','inline');
                                }

                                //alert(num)
                                if(num==6){
                                    $('#addimg').css('display','none');
                                }else{
                                    $('#addimg').css('display','block');
                                }
                                for (var i = 0; i < num; i++) {
                                    if(i==0){
                                        li += '<li data-slide-to='+i+' data-target="#carousel2" class="active"></li>';
                                        img = '<div class="item active"><img alt="image" class="img-responsive"  id='+data[i].id+' src={{ url("/upload/product/") }}/'+data[i].name+'><div class="carousel-caption"> <p>This is simple caption 2</p> </div></div>';
                                    }else {
                                        li += '<li data-slide-to='+i+' data-target="#carousel2" ></li>';
                                        img += '<div class="item "><img alt="image" class="img-responsive"  id='+data[i].id+' src={{ url("/upload/product/") }}/'+data[i].name+'></div>';

                                    }
                                        //img =img+"<img  src={{ url('/upload/type/') }}/"+data[i].name+" width='80'>";
                                };
                                $('#img_table').empty();
                                $('#img_ol').empty();
                                $('#img_table').append(img);
                                $('#img_ol').append(li);


                                // alert(data);
                                // $('#modal-form').modal('hide');

                            },
                            error: function (data) {
                                    alert(5555);
                            },
                        });



        }

        function delType(obj) {
                if($(obj).html()=='正常'){
                    var str = "确定要下架吗亲！";
                }else{
                    var str = "确定要上架吗亲！";
                }

                    if(confirm(str)){
                        //alert("点击了确认按钮");
                        ob = obj;
                        td = $(ob).parent();
                        var id = $(obj).parent().parent().children('td').eq(1).html();
                        //alert(id);
                        $.ajax({
                            url: '{{url("store/product/status")}}',
                            type: 'POST',
                            dataType: 'json',
                            cache: false,
                            data: {_token: "{{ csrf_token() }}", id: id },
                            success: function (data) {
                                if(data>0){
                                    if($(ob).html()=='正常'){
                                        $(ob).remove();
                                        $(td).append('<a  class="btn btn-default" onclick="delType(this)">下架</a>')


                                    }else{
                                        $(ob).remove();
                                        $(td).append('<a  class="btn btn-primary" onclick="delType(this)">正常</a>');
                                    }


                                }

                                // alert(data);
                                // $('#modal-form-one').modal('hide');

                            },
                        });
                    }
                    else{

                        //alert("点击了取消按钮");

                    }

        }
        function hodType(obj) {
                if($(obj).html()=='热推'){
                    var str = "确定要把热推取消吗亲！";
                }else{
                    var str = "确定要将该商品热推吗亲！";
                }

                    if(confirm(str)){
                        //alert("点击了确认按钮");
                        ob = obj;
                        td = $(ob).parent();
                        var id = $(obj).parent().parent().children('td').eq(1).html();
                        //alert(id);
                        $.ajax({
                            url: '{{url("store/product/hod")}}',
                            type: 'POST',
                            dataType: 'json',
                            cache: false,
                            data: {_token: "{{ csrf_token() }}", id: id },
                            success: function (data) {
                                if(data>0){
                                    if($(ob).html()=='热推'){
                                        $(ob).remove();
                                        $(td).prepend('<a  class="btn btn-primary" onclick="hodType(this)">普通</a>')


                                    }else{
                                        $(ob).remove();
                                        $(td).prepend('<a  class="btn btn-danger" onclick="hodType(this)">热推</a>');
                                    }


                                }

                                // alert(data);
                                // $('#modal-form-one').modal('hide');

                            },
                        });
                    }
                    else{

                        //alert("点击了取消按钮");

                    }

        }

        function addImg(obj) {
            $('#modal-form').modal('hide');
            //alert(mid);
            $('#pro_img').val(mid);

        }
        function delImg(obj) {
          // var active =  $(".active");
          // console.log(active);
                    if(confirm('亲你确定要删除吗！')){

                        //alert("点击了确认按钮");
                        var id = $(".active").children('img').attr('id');
                        $("#img_table .active").remove();
                        $("#img_ol :last-child").remove();
                        //alert(id);
                        $.ajax({
                            url: '{{url("store/product/delimg")}}',
                            type: 'POST',
                            dataType: 'json',
                            cache: false,
                            data: {_token: "{{ csrf_token() }}", id: id},
                            success: function (data) {

                                if(data>0){
                                    $('#img_table').children().eq(1).attr('class','item active');
                                    $('#img_ol').children().eq(1).attr('class','active');
                                }
                                // alert(data);
                                // $('#modal-form-one').modal('hide');

                            },
                        });
                    }
                    else{

                        //alert("点击了取消按钮");

                    }

        }
        function preImg(obj) {

                    if(confirm('亲你确定要设为预览图吗！')){
                        //alert("点击了确认按钮");
                        var id = $(".active").children('img').attr('id');
                        //alert(id);
                        $.ajax({
                            url: '{{url("store/product/preimg")}}',
                            type: 'POST',
                            dataType: 'json',
                            cache: false,
                            data: {_token: "{{ csrf_token() }}", id: id,mid:mid },
                            success: function (data) {

                                imgaa.attr('src',data);

                                // alert(data);
                                 $('#modal-form').modal('hide');

                            },
                        });
                    }
                    else{

                        //alert("点击了取消按钮");

                    }

        }
    </script>
    <script>
        $(document).ready(function () {
            $("#delmodal").click(function () {
                $('.dz-image-preview.dz-preview').remove();
                $('#modal-form-img').modal('hide');

            });

            Dropzone.options.myAwesomeDropzone = {

                autoProcessQueue: false,
                uploadMultiple: true,
                parallelUploads: 100,
                maxFiles: 100,

                // Dropzone settings
                init: function () {
                    var myDropzone = this;
                    this.element.querySelector("button[type=submit]").addEventListener("click", function (e) {
                        e.preventDefault();
                        e.stopPropagation();
                        myDropzone.processQueue();
                        setTimeout(show,3000);
                        function show()
                        {
                            $('.dz-image-preview.dz-processing').remove();
                            $('#modal-form-img').modal('hide');
                        }

                    });
                    this.on("sendingmultiple", function () {});
                    this.on("successmultiple", function (photos, response) {});
                    this.on("errormultiple", function (photos, response) {});


                }

            }

            $('.dataTables-example').dataTable();

            /* Init DataTables */
            var oTable = $('#editable').dataTable();

            /* Apply the jEditable handlers to the table */
            oTable.$('td').editable('../example_ajax.php', {
                "callback": function (sValue, y) {
                    var aPos = oTable.fnGetPosition(this);
                    oTable.fnUpdate(sValue, aPos[0], aPos[1]);
                },
                "submitdata": function (value, settings) {
                    return {
                        "row_id": this.parentNode.getAttribute('id'),
                        "column": oTable.fnGetPosition(this)[2]
                    };
                },

                "width": "90%",
                "height": "100%"
            });


        });

        function fnClickAddRow() {
            $('#editable').dataTable().fnAddData([
                "Custom row",
                "New row",
                "New row",
                "New row",
                "New row"]);

        }
    </script>

@stop